﻿@{
    ViewBag.Title = "Home Page";
}

<div class="jumbotron">
    <h1>ASP.NET</h1>
</div>

<div class="row" ng-controller="Dictionary as dvm">
    <div class="col-md-12">
        <div class="form-group">
            <input type="text" class="form-control" id="search" ng-model="dvm.searchWord" placeholder="Search">
        </div>
    </div>

    <div class="col-md-12 table-responsive">
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>Word</th>
                    <th>Transcription</th>
                    <th>Translation</th>
                    <th>Description</th>
                    <th style="width:84px;">Remove</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="word in dvm.words track by $index" ng-show="dvm.checkWord(word)">
                    <td>{{word.ForeignWord}}</td>
                    <td>{{word.Transcription}}</td>
                    <td>{{word.Translation}}</td>
                    <td>{{word.Description}}</td>
                    <td>
                        <button type="button" class="btn btn-default" ng-click="dvm.deleteWord(word.WordID, $index)">Delete</button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>